<?php if (!defined('THINK_PATH')) exit();?><!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="http://api.chinaola.net/ola/Application/Test/Public/css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="http://api.chinaola.net/ola/Application/Test/Public/css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="http://api.chinaola.net/ola/Application/Test/Public/css/base.css"/>
    <style type="text/css">
        li{list-style:none;}
        /* new */
        #headurl {
            max-width: 80px;
            width:80px;
            height: 80px;
            border-radius:100%;
        }
        .body_one{
            height:80px;
        }
        #name {
            font-size: 22px;
            color: #000;
            line-height: 30px;
            margin:0;
            text-overflow:ellipsis;
            white-space: nowrap;
            overflow:hidden;
        }
        .tiezi_title {
            line-height: 17px;
            height:17px;
        }
        .tiezi_title p {
            float: left;
            display: inline-block;
            margin-right: 10px;
        }
        .tiezi_title:after {
            content: '';
            display: block;
            clear: both;
        }
        .i_list {
            background: #FFFFFF;
        }
        .i_list>div {
            height: 38px;
            line-height: 38px;
            text-indent: 80px;
            position: relative;
            font-size: 13px;
        }
        .list_text>span:nth-child(1){
            position: absolute;
            left: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
            display: block;
            text-indent: 15px;
            color: #ff8fc0;
        }
        .list_text:after{
            content: '';
            position: absolute;
            display: block;
            left: 0;
            bottom: 0;
            text-indent: 0;
            width: 92%;
            margin: auto 4%;
            height: 1px;
            background: #cccccc;
        }
        .list_text .weixin{
            color: #ff8fc0;
        }
        .list_text:nth-last-child(1):after{
            display:none;
        }
        #list,#list2 {
            margin-top: 10px;
            background: #FFFFFF;
        }

        .mui-card {
            box-shadow: 0 1px 2px rgba(0,0,0,0);
            margin: 0 auto 10px;
        }
        #tblist li {
            padding: 15px 15px 10px;
            border-bottom:1px solid #ccc;
        }
        #listheadurl {
            -webkit-border-radius: 100%;
            -moz-border-radius: 100%;
            border-radius: 100%;
            line-height: 42px;
            max-width: 42px;
            height: 42px;
            width: 42px;
        }
        #listwriter {
            margin-top: 0;
            font-size: 12px;
            color: #000;
            height:12px;
            line-height:12px;
        }
        .mui_body_img {
            width: 100%;
            display: -moz-box;
            display: -webkit-box;
        }

        .mui_body_img img{
            display:block;
            -webkit-box-flex: 1;
            -moz-box-flex: 1;
            -ms-box-flex: 1;
            box-flex: 1;
            height:26vw;
            border:2px solid #FFFFFF;
        }
        .focused {
            background-color: gainsboro;
            color: #fff;
        }
        .people{
            padding:10px 10px 10px 80px;
        }
        .people ul:before{
            display: block;
            content: '';
            clear:both;
        }
        .people ul{
            margin-top:0;
            position: relative;
            overflow: hidden;
            height:60px;
            padding:0;
        }
        .people ul:before{
            display: block;
            content: '';
            clear:both;
        }
        .people img{
            width: 35px;
            height: 35px;
            border-radius:100%;
            margin: 0 auto;
            display: block;
        }
        .people li{
            width:15%;
            display:inline-block;
            float:left;
            margin-right:10px;
            font-size:3vw;
        }
        .people span{
            display: block;
            text-indent:0;
            text-align:center;
        }
        .title_span{
            padding:0 10px;
            font-size:12px;
            height:26px;
            line-height:26px;
            color:#fff;
            -webkit-border-radius:20px;
            -moz-border-radius:20px;
            border-radius:20px;
            background: #ffb4db;
            display:inline-block;
            text-indent: 0;
            text-align: center;
            margin-left:2px;
        }
        .info span{
            margin-left:8px;
        }
        .info li p:nth-child(2){
            color:#000000;
            font-size: 12px;
        }
        #discuss {
            font-size: 15px;
        }
        .list_text>div{
            display:inline;
        }
        .list_text>.people{
            display:block;
        }
        #send {
            position: fixed;
            bottom: 60px;
            right: 15px;
            width:17vw;
            height:17vw;
            z-index: 10;
            display:none;
        }
        #send img{
            width:100%;
            height:100%;
        }
        .hugong_top_info{
            margin-right:15px;
            font-size:13px;
        }
        .hugong_focus{
            margin-top:2px;
            padding:2px 30px;
            display:inline-block;
            border:1px solid #ccc;
            font-size:13px;
        }
        .hugong_focus:active{
            background: #ff8fc0;
            color:#fff;
            border-color:#fff;
        }
        .focused{
            background: #ff8fc0;
            color:#fff;
            border-color:#fff;
        }
        #order{
            position: fixed;
            bottom:0;
            left:0;
            display:block;
            width:100%;
            height:50px;
            line-height:50px;
            z-index:999;
            padding:0;
            background: #ff8fc0;
            border:none;
            color:#fff;
        }
        .mui-scroll{
            padding-bottom:50px;
        }
        #listtitle{
            color:#8f8f94;
        }
        .hank-table-view-cell{
            position: relative;
            z-index:999;
            overflow: hidden;
            padding: 11px 15px;
        }
        .add_img_img{
            position:relative;
        }
        .add_img_img:after{
            content:'';
            display:block;
            width:40px;
            height:40px;
            position:absolute;
            left:50px;
            top:50px;
            background: url("http://api.chinaola.net/ola/Application/Test/Public/images/v1.png") no-repeat center center;
            -webkit-background-size:100% 100%;
            background-size:100% 100%;
            z-index:999;
        }
        #jubao{
            padding-left:15px;
            padding-right: 10px;
        }
        #phone{
            display:inline-block;
            text-indent:0;
            color:#ffaf7e;
        }
        #weixin{
            display:inline-block;
            text-indent:4px;
        }

        /* 小组 */
        .hugong_diqu{
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap;
        }
        .mui-slider .mui-slider-group.mui-slider-loop{transform: translate3d(-80px, 0px, 0px) translateZ(0px); transition-duration: 0ms; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);}
    </style>
</head>
<body>
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
    <!--<button id="order" onclick="clicked('sub_order_detail.html')" type="button" class="mui-btn mui-btn-warning mui-btn-outlined">立即预约</button>-->
    <button id="order" type="button" class="mui-btn mui-btn-warning mui-btn-outlined">立即预约</button>
    <div class="mui-scroll">
        <div class="mui-content">
            <div id="head">
                <ul class="mui-table-view">
                    <li class="hank-table-view-cell mui-media">
                        <div class="add_img_img"><img id="headurl" class="mui-media-object mui-pull-left" src="./images/60x60.gif"></div>
                        <div class="mui-media-body body_one">
                            <p id="name"></p>
                            <div class="hugong_top_info hugong_diqu">服务地区:<span class="location_diqu">重庆市渝中区，</span></div>
                            <div class="hugong_top_info hugong_focus" id="focus">关注</div>
                        </div>
                    </li>
                </ul>
                <div class="i_list">
                    <div class="list_text" style="height:80px;">
                        <span>团队成员</span>
                        <div class="people">
                            <div class="mui-slider">
                                <div class="mui-slider-group mui-slider-loop">
                                    <div class="mui-slider-item mui-slider-item-duplicate startHtml">
                                    </div>
                                    <div class="mui-slider-item hank-item">
                                        <ul class="mui-table-view mui-grid-view">
                                        </ul>
                                    </div>
                                    <div class="mui-slider-item mui-slider-item-duplicate endHtml">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="list_text"><span>电　　话:</span>
                        <div id="phone"></div>
                    </div>
                    <div class="list_text">
                        <span class="mui-pull-left">技能标签</span>
                        <div id="skill">
                            <!--<div class="title_span">专业</div>-->
                            <!--<div class="title_span">专业护理</div>-->
                            <!--<div class="title_span">十年经验</div>-->
                        </div>
                    </div>
                </div>

                <div id="list">
                    <div class="mui-col-sm-12 mui-col-xs-12">
                        <div class="mui-card-header" style="display: block;">
                            <span class="mui-pull-left" style="color: #ff8fc0;font-size:16px;">交易评价( <span id="pingNum"></span> )</span>
                            <!--<a href="#sort" id="openPopover">-->
                                <!--<span class="mui-pull-right" onclick="click_more();" style="color: #AAAAAA;font-size:14px;">更多 ></span>-->
                            <!--</a>-->
                        </div>
                    </div>
                    <div class="info">
                        <ul class="mui-table-view">
                        </ul>
                    </div>
                </div>

                <div id="list2">
                    <div class="mui-card-header" style="display: block;">
                        <span class="mui-pull-left" style="color: #ff8fc0;font-size:16px;">团队动态</span>
                        <!--<a href="#sort" id="openPopover2">-->
                            <!--<span class="mui-pull-right" onclick="click_more();" style="color: #AAAAAA;font-size:14px;">更多 ></span>-->
                        <!--</a>-->
                    </div>
                    <div class="mui-card">
                        <ul id="tblist" class="mui-table-view">
                            <!--<li onclick="clicked('sub_find_tieba_detail.html')" class="mui-table-view-cell mui-media">-->
                            <!--<a href="javascript:;">-->
                            <!--<img id="listheadurl" class="mui-media-object mui-pull-left" src="./images/60x60.gif">-->
                            <!--<div class="mui-media-body">-->
                            <!--<h5 id="listwriter">针灸师杨康ID:12888</h5>-->
                            <!--<h4 id="listtitle">中风小常识,哪些是中风前兆</h4>-->
                            <!--<p id="summary" class="mui-ellipsis">1.有时候头突然眩晕，没有行动力。</p>-->
                            <!--<div class="mui_body_img">-->
                            <!--</div>-->
                            <!--<p><span id="time">2016-10-25 17:34</span><span id="discuss" class="mui-icon mui-icon-chatbubble mui-pull-right">12</span></p>-->
                            <!--</div>-->
                            <!--</a>-->
                            <!--</li>-->
                        </ul>
                    </div>
                </div>

            </div>
        </div>
    </div>

</div>
<div id="send" onclick="find_send();">
    <img src="http://api.chinaola.net/ola/Application/Test/Public/images/release.png">
</div>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/mui.min.js"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/common.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/storage.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/server.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="http://api.chinaola.net/ola/Application/Test/Public/js/findtiebalist.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
            down: {
                callback: pulldownRefresh
            },
            up: {
                contentrefresh: '正在加载...',
                callback: pullupRefresh
            }
        }
    });

    var token = lget('token'),content_title,content_content,share_fakeid;
    var pageSize = 1,fakeid;

    function click_more(){
        mui.alert('暂未开通');
    }

        //预约服务
        $("#order").click(function() {
            location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=o.dcloud.Stroke_hospital';
        });

    //获取地址栏信息
    function GetQueryString(name)
    {
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }

        mui.ajax(showCommunityDetail, {
            data: {
                "fakeid": GetQueryString("fakeid")
            },
            dataType: 'json', //服务器返回json格式数据
            type: 'post', //HTTP请求类型
            timeout: 10000, //超时时间设置为10秒；
            success: function(data) {
                $("#fans").text(data.fans);
                $("#name").text(data.name);
                $("#phone").text(data.phone);
                $("#weixin").text(data.wechat);
                $(".location_diqu").text(data.server_adress);
                content_title = '小组:'+data.name+',电话:'+data.phone;
                content_content = '提供:'+data.skill+'等团队服务';
                share_fakeid = fakeid;

                //成员 暂时只考虑6及人以下
//						console.log(JSON.stringify(data.doctor_member.length));
                var five;
                for(var pnum = 0;pnum < data.doctor_member.length;pnum++){
//                        for(var pnum = 0;pnum < 6;pnum++){
                    five = Math.ceil((pnum+1)/5);
                    if($('.people ul').length <five ){
                        $('.hank-item').after('<div class="mui-slider-item"><ul class="mui-table-view mui-grid-view"></ul></div>')
                    }
                    $(".people .mui-slider-item").eq(five).children('ul').append('<li '+data.doctor_member[pnum].id+'>' +
                        '<img src="'+data.doctor_member[pnum].headurl+'"/>' +
                        '<span>'+data.doctor_member[pnum].name+'</span>' +
                        '</li>');
                }
                var startHtml = $(".mui-slider-item:nth-child(2)").html();
                var endHtml = $(".mui-slider-item:nth-last-child(2)").html();
                $(".startHtml").append(startHtml);
                $(".endHtml").append(endHtml);

                //评价
                $("#pingNum").text(data.group_evaluate_count);
                for(var pingNum = 0;pingNum < data.group_evaluate.length;pingNum++){
                    $(".info ul").append('<li class="mui-table-view-cell" id="'+data.group_evaluate[pingNum].id+'">' +
                        '<p>'+data.group_evaluate[pingNum].phone+'<span>  '+data.group_evaluate[pingNum].evaluate+'</span></p>' +
                        '<p>'+data.group_evaluate[pingNum].content+'</p>' +
                        '<p style="text-align:right;font-size:11px;">'+data.group_evaluate[pingNum].create_time+'</p>' +
                        '</li>')
                }

                //标签
                var ajax_skill;
                var num_skill = data.skill.split(',').length;
                var text_skill;
                for(var x = 1;x<=num_skill;x++){
                    ajax_skill = data.skill.split(',')[x-1];
                    text_skill = '<div class="title_span">'+ajax_skill+'</div>';
                    $("#skill").append(text_skill);
                }
                $('#headurl').attr("src", data.headurl);
                $('#addr').text(data.place);

                if(data.flag == 0) {
                    $('#focus').removeClass('focused');
                    $('#focus').text("关注");
                } else if(data.flag == 1) {
                    $('#focus').addClass('focused');
                    $('#focus').text("已关注");
                } else {
                    alert(error)
                }

                show_send();		//是否显示发帖
            },
            error: function(xhr, type, errorThrown) {
                mui.toast("网络连接失败")
            }
        });

        page_Size(pageSize,fakeid);


    function page_Size(pageSize,fakeid){
        //团队动态
        mui.ajax(showPost, {
            data: {
                "page": pageSize,
                "fakeid": fakeid
            },
            dataType: 'json', //服务器返回json格式数据
            type: 'post', //HTTP请求类型
            timeout: 10000, //超时时间设置为10秒；
            success: function(data) {
                //			    		alert(JSON.stringify(data))
                //console.log("..."+JSON.stringify(data));
                addlist(data, "#tblist");
                List_fn();
                hide_null_img();
            },
            error: function(xhr, type, errorThrown) {
                gotoerror();
            }
        });
    }

    //图片显示
    function List_fn(){
        var List_index = $(".Tieba_list");
        var list_width = $(".mui_body_img");
        var list_html;
        for(var lx=0;lx<List_index.length;lx++){
            var n = List_index.eq(lx).find(".mui_body_img img").length;
            switch(n)
            {
                case 1:
                    List_index.eq(lx).find(".mui_body_img").eq(0).children("img").attr("style","height:"+list_width.width()/1+"px");
                    break;
                case 2:
                    List_index.eq(lx).find(".mui_body_img").eq(0).children("img").attr("style","height:"+list_width.width()/2+"px");
                    break;
                case 3:
                    List_index.eq(lx).find(".mui_body_img").eq(0).children("img").attr("style","height:"+list_width.width()/3+"px");
                    break;
                case 4:
                    add_img(List_index,lx,3);
                    List_index.eq(lx).find(".mui_body_img").eq(1).children("img").attr("style","height:"+list_width.width()/1+"px");
                    break;
                case 5:
                    add_img(List_index,lx,3);
                    add_img(List_index,lx,4);
                    List_index.eq(lx).find(".mui_body_img").eq(1).children("img").attr("style","height:"+list_width.width()/2+"px");
                    break;
                case 6:
                    add_img(List_index,lx,3);
                    add_img(List_index,lx,4);
                    add_img(List_index,lx,5);
                    List_index.eq(lx).find(".mui_body_img").eq(1).children("img").attr("style","height:"+list_width.width()/3+"px");
                    break;
            }

        }
    }

    function add_img(List_index,lx,index){
        list_html = List_index.eq(lx).find(".mui_body_img").children("img").eq(index).attr("src");		//获取内容
        List_index.eq(lx).find(".mui_body_img").children("img").eq(index).hide().attr("src","");
        if(index == 3){
            List_index.eq(lx).find(".mui_body_img").eq(0).after("<div class='mui_body_img'><img src='"+list_html+"' alt=''></div>");
        }else{
            List_index.eq(lx).find(".mui_body_img").eq(1).append("<img src='"+list_html+"' alt=''>");
        }
    }

    function hide_null_img(){
//				var List_index = $("#tblist>li");
        var list_width = $(".mui_body_img");
        var list_width_length = $(".mui_body_img img");
        var null_img;
        for(var ly=0;ly<list_width_length.length;ly++){
            null_img = list_width_length.eq(ly).attr("src");
            //console.log(null_img);
            if(null_img == "" || null_img == null || null_img == "null" || null_img == "undefined" || null_img == undefined ){
                list_width_length.eq(ly).remove();
            }
        }
    }

    //获取地址栏信息
    function GetQueryString(name)
    {
        var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if(r!=null)return  unescape(r[2]); return null;
    }

    function find_send(){
        location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=o.dcloud.Stroke_hospital';
    }

    //点击关注
    $("#focus").click(function() {
        location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=o.dcloud.Stroke_hospital';
    });

    /**
     * 下拉刷新具体业务实现
     */
    function pulldownRefresh() {
        setTimeout(function() {
            location.reload();
            mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
        }, 1500);
    }
    var count = 0;
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {
        pageSize++;
        setTimeout(function() {
            mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
        }, 1500);
        page_Size(pageSize,fakeid);
    }

    function reload(){
        window.location.reload();
    }
</script>
</body>

</html>